<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <div id="qwe1">
    <p>段1</p>
    <p id="op">段2</p>
    <p>段3</p>
    <p>段4</p>
    <p id="pp">sp</p>
    <p>段5</p>
    <p>段6</p>
    <p>段7</p>
    <div>iiii</div>
  </div>
  <script>
    var di = document.getElementById("qwe1");
    var pi = document.getElementById("pp");
    var op = document.getElementById("op");
    var diiv =document.createElement("div");
    diiv.innerText = "qs";
    di.appendChild(diiv)
    // 替换节点•  parentNode.replaceChild(newChild, oldChild)
      di.replaceChild(diiv,pp)
    // 插入节点parentNode. insertBefore(newNode, referenceNode)
      di.insertBefore(diiv,op)
      // 第二个为null的话插入到末尾
      di.insertBefore(diiv,null)
    // 删除节点
      di.removeChild(op)

  </script>
</body>
</html>